import { Directive, App, DirectiveBinding, VNode } from 'vue';
import { usePermissionStore } from '@/config/pinia/permission.store.ts';
import { containsAllStringArr } from '@/config/utils/utils.ts';
const permissionStore = usePermissionStore();
export const registerHasRole = (app: App): void => {
	app.directive('hasRole', {
		mounted(
			el: any,
			binding: DirectiveBinding<any>,
			vNode: VNode<any, any>,
			prevVNode: VNode<any, any> | null
		): void {
			const roleArr: Array<string> = permissionStore.roleList;
			console.log(roleArr);
			switch (Object.prototype.toString.call(binding.value)) {
				case '[object Array]':
					if (!containsAllStringArr(roleArr, binding.value)) {
						el.parentNode.removeChild(el);
					}
					break;
				case '[object String]':
					if (!roleArr.includes(binding.value)) {
						el.parentNode.removeChild(el);
					}
					break;
				default:
					el.parentNode.removeChild(el);
					break;
			}
		}
	} as Directive);
};